<div class="tile">
	<div class="nav">
		<div class="nav-li focus">分类管理</div>
	</div>

	<hr />

	<div class="bigbox">
		
		<div class="tiles-box">
			<div class="add-tag">
				<input maxlength="5" type="text" value="{{$Cache.tag.new_tag_name}}" bind-input="{{'$Cache.tag.new_tag_name'}}">
				<android:paperbutton event-click="{{'$Event.tag.add_new_tag'}}">添加分类</android:paperbutton>
			</div>
			<div class="hr"></div>
			<div class="tag-list">
				<android:draggableArrayWrap dir="h" event-moveend="{{'$Event.tile.update_tag_index'}}">
				{{#each $Cache.bus_tags_detail}}
					<android:draggableItemWrap>
						<android:draggableItem>
							<android:paperbutton draggable="true" layer-num="{{$Top.$Cache.tile.editing_tag._id==_id?0:1}}" event-click="{{'$Top.$Event.tile.to_editing'}}">
								{{tag_name}}
							</android:paperbutton>
						</android:draggableItem>
					</android:draggableItemWrap>
				{{/each}}
				</android:draggableArrayWrap>
			</div>
			<div class="hr"></div>
			{{#if $Cache.tile.editing_tag}}
			<div class="goods-box">
				<div class="tile-goods">
					<div class="titlein">当前选定标签：
						{{#if $Cache.tile.is_in_rename_tag}}
						<input type="text" value="{{$Cache.tile.editing_tag.tag_name}}" bind-input="{{'$Cache.tile.editing_tag.tag_name'}}">
						<button event-click="{{'$Event.tile.submit_new_tag_name'}}" title="确认">
							<android:icon style="font-size: 1em;transform: scale(1.3);" type="navigation-check"></android:icon>
						</button>
						<button event-click="{{'$Event.tile.cancel_new_tag_name'}}" title="取消">
							<android:icon style="font-size: 1em;transform: scale(1.3);" type="navigation-cancel"></android:icon>
						</button>
						{{#else}}
						<span>{{$Cache.tile.editing_tag.tag_name}}</span>
						<button event-click="{{'$Event.tile.to_rename_tag'}}" title="重命名标签">
							<android:icon style="font-size: 1em;transform: scale(1.3);" type="image-edit"></android:icon>
						</button>
						<button class="delete" event-click="{{'$Event.tile.remove_tag'}}" title="删除此标签">
							<android:icon style="font-size: 1em;transform: scale(1.3);" type="action-delete"></android:icon>
						</button>
						{{/if}}
					</div>
					<table class="box">
						{{#each $Cache.tile.editing_tag.showing_content}}
						<tr class="item">
							<td  class="img">
								<img class="goods-img" bind-src="{{preview_img_url}}?imageView/1/w/25/h/25" />
							</td>
							<td class="info">
								{{goods_name}}
							</td>
							<td>
								<button event-click="{{'$Top.$Event.tile.remove_goods_from_tag'}}" class="delete" title="删除此商品">
									<android:icon style="font-size: 1em;transform: scale(1.3);" type="content-remove-circle-outline"></android:icon>
								</button>
							</td>
						</tr>
						{{/each}}
						{{#if $Cache.tile.editing_tag.detail_content.length>$Cache.tile.editing_tag.showing_content.length}}
						<tr>
							<td colspan="3" class="show-more" event-click="{{'$Top.$Event.tile.editing_tag.show_more'}}"> 显示更多 </td>
						</tr>
						{{/if}}
						{{#if !$Cache.tile.editing_tag.detail_content.length}}
							<p style="text-align:center;">此分类下还没有商品</p>
						{{/if}}
					</table>
				</div>

				<div class="search-goods">
					<div class="title">
						<android:input bind-input="{{'$Cache.tile.search_text'}}" event-input="{{'$Event.tile.search'}}" label="搜索商品"></android:input>
					</div>
					<table class="paper-table box">
						<thead>
							<td width="12%"></td>
							<td>商品名</td>
							<td width="30%">操作</td>
						</thead>
						{{#> "tile_goods_list","$This",!$Cache.tile.is_searching}}
						{{#> "tile_search_goods_list","$This",$Cache.tile.is_searching}}
					</table>
					{{#if !$Cache.tile.is_searching}}
						<pagecut
							num="{{$Cache.tile.goods_with_page_info.num}}"
							page="{{$Cache.tile.goods_with_page_info.page}}"
							total-page="{{$Cache.tile.goods_with_page_info.total_page}}"
						></pagecut>
					{{/if}}
				</div>
			</div>
			{{/if}}
		</div>

	</div>

</div>
<xmp type="template" name="tile_goods_list">
	{{#each $Cache.tile.goods_with_page_info.goods}}
	<tr class="item">
		<td>
			<img class="goods-img" bind-src="{{preview_img_url}}?imageView/1/w/25/h/25" />
		</td>
		<td title="{{_id}}">
			{{goods_name}}
		</td>
		<td>
			<button class="{{#IndexOf $Top.$Cache.tile.editing_tag.content,_id,'hidden'}}" event-click="{{'$Top.$Event.tile.add_goods_to_tag'}}" class="add" title="添加到选定标签">
				<android:icon style="font-size: 1em;transform: scale(1.3);" type="content-add-circle-outline"></android:icon>
			</button>
		</td>
	</tr>
	{{/each}}
</xmp>

<xmp type="template" name="tile_search_goods_list">
	{{#each $Cache.tile.search_goods}}
	<tr class="item">
		<td  class="img">
			<img class="goods-img" bind-src="{{preview_img_url}}?imageView/1/w/25/h/25" />
		</td>
		<td class="info">
			{{goods_name}}
		</td>
		<td>
			<button event-click="{{'$Top.$Event.tile.add_goods_to_tag'}}" class="add" title="添加到选定标签">+</button>
		</td>
	</tr>
	{{/each}}
	{{#if !$Cache.tile.search_goods.length}}
	<tr><td colspan="3"><center><i>找不到相关商品</i></center></td></tr>
	{{/if}}
</xmp>
<style type="text/css">
	.tile-goods{
		vertical-align: top;
	}
	.tile-title.editing{
		background-color: #0020AF!important;
		box-shadow: none!important; 
	}
	.tag-list button[draggable]{
		cursor: move;
	}
</style>